<template>
	<view>
			
				<u-list
					@scrolltolower="scrolltolower"
				>
					<u-list-item
						v-for="(item, index) in this.$store.state.chat.chatObjectList"
						:key="item.id+'-'+item.accept_type"
					>
						<u-cell
						@click="goChat(item)"
						>
							
							<view class="headerImg" slot="icon">
								<u-avatar :src="item.picture" shape="square"></u-avatar>
													
							</view>
							<view class="info" slot="title">
								<view class="name">
									{{item.account}}
								</view>
								<view class="message">
									{{item.content}}
								</view>
							</view>
							<view class="time" slot="value">
								{{item.create_time}}
							</view>
						</u-cell>
					</u-list-item>
				</u-list>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				chatList: []
			}
		},
		onLoad() {
		
		},
		onShow() {
			
		
		},
		methods: {
			
			scrolltolower() {
							console.log('触底了')
						},
				
			async goChat(object){//去到聊天界面
				await this.$store.commit('chat/setChatObjectData',object)
				uni.navigateTo({
					url:'../chat/index'
				})
			}
		}
	}
</script>

<style scoped lang='scss'>
		.headerImg{
			image{
				height: 100%;
				width: 50rpx;
			}
			margin-right: 10rpx;
		}
			
		.info{
			height: 100%;
			display: flex;
			flex-direction:column;
			
			.name{
				height: 40%;
				max-width:200rpx ;
				overflow: hidden;
					text-overflow:ellipsis;
					white-space: nowrap;
			}
			.message{
				height: 40%;
				max-width:300rpx ;
				overflow: hidden;
					text-overflow:ellipsis;
					white-space: nowrap;
				/* border: 1px solid red; */ 
				font-size: 18rpx;
				color:#8F8F94;
			}
		}
		.time{
			height: 40%;
			font-size: 18rpx;
			color:#8F8F94;
		}
</style>
